<template>
	<div>	
	
		<bi-tool-tip :lang-type="langType" @tooltip-result="onToolTip" :option="wordCloud.tooltip"></bi-tool-tip>
		<bi-word-cloud-series
			:lang-type="langType"
			@series-result="onSeries"
			:series-name="item.name"
			:option="wordCloud.series[idx]"
			v-for="(item,idx) in wordCloud.series"
			:key="idx"
		></bi-word-cloud-series>

		<div style="text-align:center">
			<md-button
				class="md-raised md-primary"
				@click="createChartOption"
			>{{getLangText(label.createChart)}}</md-button>
		</div>
	</div>
</template>
<script>
import ToolTip from "@/components/comp/ToolTip";
import WordCloudSeries from "@/components/chart/WordCloudSeries";
export default {
    name:"WordCloudOption",
    props:{
        langType:{
            type:String,
            default:window.localStorage.getItem("langType")
        },
        option:{
            type:Object,
            default:function () {return {};  }
        }
    },
    components:{      
        'bi-tool-tip':ToolTip,
        'bi-word-cloud-series':WordCloudSeries,
    },
    data:()=>({
        label:{
             bgColor:{zh:"背景颜色",en:"BgColor"},             
             createChart: { zh: '生成图表', en: 'CREATE CHART' },            
        },
        isShow:false,
        wordCloud:{
            tooltip:[],
            series:[
                {}
            ]
        },
        
    }),
    watch:{
        option(){
            this.parseObj();
        },
        // wordCloud:{
        //     deep:true,
        //     handler(){
        //         this.createChartOption();
        //     }
        // }
        
    },
    methods:{       
        onLegend(op){
            this.wordCloud.legend=op;
        },
        
        onVisualMap(op){
            this.wordCloud.visualMap=op;
        },
        onToolTip(op){
            this.wordCloud.tooltip=op;
        },
        onSeries(op){
            this.wordCloud.series[0]=op;
            
        },
        
        parseObj(){
            // this.doVisualMap();
            if(!this.option||JSON.stringify(this.option)=='{}')return;
            for(var key in this.option){
                this.wordCloud[key]=this.option[key];               
            }

        },
        createChartOption(){
          this.$emit("create-chart",this.wordCloud);
        },
        
    },
    mounted(){
        this.parseObj();
    }
}
</script>
